<template>
	<view class="gotest">
		<!-- 导航栏 -->
		<navBar :backFont="true" :title="type" >
		</navBar>	
		<view class="gotest_card" v-show="select_area">
			<text class="choiceMore">可多选</text>
			<text class="testAera">已选择测试区域</text>
			<uni-fav :content-text="contentText_A" :checked="is_checked" class="favBtn" :star="false" :circle="true" bg-color="#b7d4e3" bg-color-checked="#007aff" fg-color="#ffffff" fg-color-checked="#ffffff" @click="favClick(1)" />
			<uni-fav :content-text="contentText_B" :checked="is_checked_B" class="favBtn" :star="false" :circle="true" bg-color="#b7d4e3" bg-color-checked="#007aff" fg-color="#ffffff" fg-color-checked="#ffffff" @click="favClick(2)" />
		</view>
		<view class="gotest_card" v-show="!select_area">
			<text class="testAera">已选择测试班级</text>
			<uni-data-picker placeholder="请选择班级" popup-title="请选择需要测试的班级" :localdata="reactive_obj.dataTree" v-model="classes"
			@change="onchange" >
			</uni-data-picker>
		</view>
		<myBtn @click="goMethod()" title="立即开始测试" color="#0aa1ed" width="25vw" height="8vh"></myBtn>
	</view>
</template>

<script lang="ts" setup>
import { reactive, onMounted, ref, onBeforeMount, getCurrentInstance } from 'vue';
import requester from "../../server/requester";
import {
	    onLoad,
	  } from "@dcloudio/uni-app";
	  
	  
let userToken:any
onMounted(()=>{
		try {
			userToken = uni.getStorageSync('user_token');
			console.log("userToken====>>>",userToken);
			if (userToken == "") {
				uni.navigateTo({
					url:'/pages/login/login',
				})
			}
			// getClassInfo()
			getGradeInfo()
		} catch (e) {
			// error
			uni.navigateTo({
				url:'/pages/login/login',
			})
		}
	})
    /*运动类型 */
	let type = ref("")
	let sportsID:any
	// onLoad 接受 A 页面传递的参数
	  onLoad((option) => {
	   console.log(option);
	   type.value = option.type
	   if(option.type == "跳绳" || option.type == "引体向上"){
		   select_area.value = true
	   }
	   if(option.type == "跳绳"){
	   		sportsID = 1005
	   }else if(option.type == "立定跳远"){
	   		sportsID = 1001
	   }else if(option.type == "100米"){
	   		sportsID = 1002
	   }else if(option.type == "引体向上"){
	   		sportsID = 1003
	   }else if(option.type == "仰卧起坐"){
	   		sportsID = 1004
	   }else if(option.type == "实心球"){
	   		sportsID = 1006
	   }
	   
	  });
	  
	  let reactive_obj = reactive({
		  dataTree:[]as any[]
	  })
	  
	let is_checked = ref(false)
	let is_checked_B = ref(false)
	let contentText_A= {
					contentDefault: '区域A',
					contentFav: '已选择区域A'
				}
	let contentText_B= {
					contentDefault: '区域B',
					contentFav: '已选择区域B'
				}			
	const favClick = (index)=>{
		if(index == 1){
			is_checked.value = !(is_checked.value)
		}
		if(index == 2){
			is_checked_B.value = !(is_checked_B.value)
		}
			}
	let select_area = ref(false)
	//当前用户选择的班级
	let current_classID :any = null
	let current_className:any 
	let onchange=(e:any)=> {
		console.log('onchange:', e);
		current_classID = e.detail.value[1].value 
		current_className = e.detail.value[1].text 
	}
	let classes:any = ref('')
			
	const goMethod = () => {
		if (!current_classID) {
			uni.showToast({
				title:"请先选择测试班级",
				icon:"none"
			})
			return
		}
		uni.navigateTo({
			url:'/pages/classTest/classTest?classId='+current_classID + "&sportsID="+sportsID + "&className="+current_className,
		})
	}
	
	
	const getGradeInfo = async()=>{
		let data = {
				}
		let result:any = await requester({
			url:'/AiSports/grade/Query',
			method:'POST',
			data,
			headers:{
				token:userToken
			}
		})
		
		console.log( '年级====>>>', result);
		let grade:any = result.data.gradeList
		grade.forEach(async (v:any)=>{
			let classList:any = await  getClassInfo(v.id)
			console.log('函数返回的list=====>>>>>',classList );
			let dataTreeObj:any = {
				text:v.name,
				value:v.id,
				children:[],
			}
			classList.forEach((value:any)=>{
				let childrenObj = {
					text:value.Name,
					value:value.ClassID
				}
				dataTreeObj.children.push(childrenObj)
			})
			reactive_obj.dataTree.push(dataTreeObj)
		})
		console.log('最终结果',reactive_obj.dataTree);
	}
	const getClassInfo = async(grade:any)=>{
		let data = {
			GradeID:grade,
			}
		let result:any = await requester({
			url:'/AiSports/Class/Query',
			method:'POST',
			data,
			headers:{
				token:userToken
			}
		})
		
		console.log( '班级====>>>', result);
		return result.data.clazzList
	}
</script>
<style>
	.gotest{
		padding: 11vh 0  0 0 ;
		width: 100vw;
		height: 89vh;
		overflow: hidden;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
		
	}
	 .gotest_card{
		 display: flex;
		 width: 35vw;
		 height: 65vh;
		 align-items: center;
		 background-color: #fff;
		 border-radius: 1vw;
		 flex-direction: column;
		 margin: 5vh 0;
		 position: relative;
	 }
	 .choiceMore{
		 display: block;
		 background-color: #4ce678;
		 color: #fff;
		 position: absolute;
		 left: 0 ;
		 padding: 1vh 1vw  ;
		 top: 0%;
		 border-radius: 0.5vw 0  0.5vw 0;
	 }
	 .testAera{
		 margin: 20vh 0 7vh 0;
		 font-size: 0.8rem;
		 color: #aaa;
	 }
	 .uni-fav{
		 width: 20vw !important;
		 height: 8vh;
		 border: 1px solid #0aa1ed;
		 margin: 1vh 0 ;
	 }
</style>